<div nz-row>
  <div nz-col nzSpan="4" style="background-color: white">
    <div style="margin-top: 10px">
      <nz-tabset nzCentered>
        <nz-tab nzTitle="调度中心">
          <div style="margin: 0 5px 0 5px; text-align: center">
            <nz-input-group [nzSize]="'small'" style="margin-bottom: 10px; width: 80%; border-radius: 6px" [nzPrefix]="prefixTemplateUser">
              <input type="text" nz-input [(ngModel)]="groupSearch" (ngModelChange)="groupListChange($event)" placeholder="搜索历史对话" />
            </nz-input-group>

            <ng-template #prefixTemplateUser> <span nz-icon nzType="search"></span></ng-template>
            <button style="width: 20%" nz-button nzType="text" [nzSize]="'small'" (click)="createGroup(addGroupTmpl)">
              <span nz-icon nzType="plus" nzTheme="outline"></span>
            </button>
          </div>

          <div class="left-side-wrapper">
            <ul nz-menu nzMode="inline" class="sider-menu" [nzTheme]="'light'">
              @for (item of currentGroupList; track $index) {
                <li nz-menu-item [nzSelected]="currentGroup.groupCode == item.groupCode">
                  <div>
                    <a (click)="getJobList(item)">{{ item.groupName }} </a>
                    @if (item.groupCode != 'all') {
                      <button
                        style="margin-top: 10px; float: right"
                        nz-button
                        nzType="text"
                        nz-button
                        nzSize="small"
                        nzTrigger="hover"
                        nz-dropdown
                        [nzDropdownMenu]="moreMenu"
                        ><span nz-icon nzType="more" nzTheme="outline"></span>
                      </button>

                      <nz-dropdown-menu #moreMenu="nzDropdownMenu">
                        <ul nz-menu>
                          <li nz-menu-item>
                            <a (click)="editGroup(item, editGroupTmpl)"
                              ><span style="margin-right: 5px" nz-icon nzType="edit" nzTheme="outline"></span>重命名</a
                            >
                          </li>
                          <li nz-menu-item>
                            <a (click)="deleteGroup(item.groupCode)"
                              ><i style="margin-right: 5px" nz-icon nzType="delete" nzTheme="outline"></i>删除</a
                            >
                          </li>
                        </ul>
                      </nz-dropdown-menu>
                    }
                  </div>
                </li>
              }
            </ul>
          </div>
        </nz-tab>
      </nz-tabset>
    </div>
  </div>
  <div nz-col nzSpan="20">
    <nz-card>
      <div nzLayout="inline" se-container>
        <se [label]="currentGroup.groupName" noColon />
        <se>
          <nz-select
            style="width: 110px"
            [(ngModel)]="searchScheduleStatus"
            (ngModelChange)="jobListChange()"
            nzAllowClear
            nzPlaceHolder="作业状态"
          >
            <nz-option nzValue="started" nzLabel="已启动" />
            <nz-option nzValue="stopped" nzLabel="已停止" />
            <nz-option nzValue="disable" nzLabel="已禁用" />
            <nz-option nzValue="failed" nzLabel="失败" />
          </nz-select>
        </se>

        <se>
          <nz-input-group [nzSize]="'default'" style="width: 150px; border-radius: 6px" [nzSuffix]="prefixTemplateUser">
            <input
              nz-input
              name="dbSourceName"
              placeholder="按作业编码，名称查询"
              [(ngModel)]="searchJobName"
              (ngModelChange)="jobListChange()"
            />
          </nz-input-group>

          <ng-template #prefixTemplateUser> <span nz-icon nzType="search"></span></ng-template>
        </se>
        <se>
          <!-- <button nz-button nzType="primary" (click)="query()" [nzLoading]="isLoading">查询</button> -->
          <button nz-button nzType="default" (click)="restartAllJob()" [nzLoading]="restarting">
            <span>重启作业</span>
          </button>
          <button nz-button nzType="default" (click)="startJobByGroup()" [nzLoading]="restarting">
            <span>启动作业</span>
          </button>
          <button nz-button [nzType]="'default'" (click)="stopJobByGroup()" [nzLoading]="restarting">
            <span>停止作业</span>
          </button>
          <button nz-button [nzType]="'default'" (click)="drawer_open('')">
            <span>添加作业</span>
          </button>
        </se>
      </div>
      <st
        #st
        [data]="currentJobList"
        [columns]="columns"
        [expand]="expand"
        [ps]="500"
        size="small"
        [scroll]="{ x: '2000px' }"
        expandRowByClick
        expandAccordion
      >
        <ng-template #expand let-item let-index="index" let-column="column">
          <sv-container size="small" col="3">
            <sv-title>更多内容</sv-title>
            <sv label="作业组" type="success" col="3">{{ item!.groupCode }}</sv>
            <sv label="服务日志" col="3">{{ item!.scheduledInfo }}</sv>
            <sv label="备注" col="3">{{ item!.remark }}</sv>
            <sv label="执行程序" type="success" col="1">{{ item!.executeName }}</sv>
            <sv label="执行方法" type="success" col="1">{{ item!.executeMethod }}</sv>
            <sv label="请求参数" type="success" col="1">{{ item!.executeParam }}</sv>
            <!-- <sv label="元数据格式" type="danger">{{ caseStatusName(item.caseStatus) }}</sv> -->

            <sv label="上次运行时间">{{ item!.jobStartTime }}</sv>
            <sv label="上次完成时间">{{ item!.jobEndTime }}</sv>
            <sv label="" />
            <sv label="上次运行结果" col="1">{{ item!.jobResult }}</sv>
            <sv label="上次运行消耗">{{ item!.jobCost }}</sv>

            <!-- <sv label="密码" optionalHelp="点击查看"> <a class="lg-sm" (click)="msg.msg_success(item!.password)">******</a></sv> -->
            <sv label="创建人">{{ item!.createdBy }}</sv>
            <sv label="创建时间">{{ item!.createdDate }}</sv>
            <sv label="创建人">{{ item!.lastModifiedBy }}</sv>
            <sv label="创建时间">{{ item!.lastModifiedDate }}</sv>
          </sv-container>
        </ng-template>
      </st>
    </nz-card>
  </div>
</div>

<nz-drawer
  [nzBodyStyle]="{ overflow: 'auto' }"
  [nzWidth]="drawer_option.width"
  [nzVisible]="drawer_option.visible"
  nzPlacement="right"
  [nzTitle]="drawer_option.title"
  [nzFooter]="footerTpl"
  [nzMaskClosable]="false"
  (nzOnClose)="drawer_close()"
>
  <ng-container *nzDrawerContent>
    <form nz-form [formGroup]="pform" nzLayout="horizontal" size="compact" se-container="2">
      <se col="2" label="选择分组" required>
        <nz-select formControlName="groupCode" style="width: 100%" nzPlaceHolder="选择分组" nzAllowClear>
          @for (o of groupList; track $index) {
            @if (o.groupCode != 'all') {
              <nz-option [nzValue]="o.groupCode" [nzLabel]="o.groupName" />
            }
          }
        </nz-select>
      </se>
      <se col="2" label="作业编码" optionalHelp="推荐使用有业务含义的字母或数字" required>
        <input nz-input name="code" formControlName="code" />
      </se>
      <se col="1" class="af-form-item" label="作业名称" required>
        <input nz-input name="name" formControlName="name" />
      </se>
      <se
        col="2"
        label="表达式"
        required
        optionalHelp="Cron表达式由秒、分钟、小时、天、月份及周六字段组成，例如0/2 * * * * * 表示的是每2秒执行一次，0 2 1 * * ?每月1日凌晨2点执行任务"
      >
        <input nz-input name="cron" formControlName="cron" />
      </se>
      <se col="2" label="执行类型" required>
        <nz-select formControlName="executeType" style="width: 100%" nzPlaceHolder="请选择实体仓" nzAllowClear>
          <nz-option *ngFor="let o of executeTypes" [nzValue]="o.value" [nzLabel]="o.label" />
        </nz-select>
      </se>
      <se
        col="1"
        label="执行程序"
        required
        optionalHelp="执行程序名称，若是请求地址，填写url地址； 若类类型， 填写类名称； 若时Bean类型， 填写Bean名称"
      >
        <input nz-input name="executeName" formControlName="executeName" />
      </se>
      <se
        col="1"
        label="执行方法"
        required
        optionalHelp="若是请求地址，GET，POST方法； 若类类型， 填写类对象方法名； 若时Bean类型， 填写Bean方法名"
      >
        <input nz-input name="executeMethod" formControlName="executeMethod" />
      </se>
      <se col="1" label="请求参数" optionalHelp="填写JSON格式请求参数">
        <input nz-input name="executeParam" formControlName="executeParam" />
      </se>

      <se col="2" label="线程数" optionalHelp="填写JSON格式请求参数">
        <nz-input-number name="numberOfThread" formControlName="numberOfThread" [nzMin]="1" [nzMax]="100" [nzStep]="1" />
      </se>
      <se col="2" label="数据条数" optionalHelp="填写JSON格式请求参数">
        <nz-input-number name="numberOfData" formControlName="numberOfData" [nzMin]="1" [nzMax]="1000" [nzStep]="1" />
      </se>
      <se label="启动类型" required>
        <nz-select
          formControlName="startupType"
          style="width: 100%"
          nzPlaceHolder="自启动会再程序重启时自动启动， 手工启动必须程序启动后手工操作来启动, 禁用不在使用"
          nzAllowClear
        >
          <nz-option *ngFor="let o of startTypes" [nzValue]="o.value" [nzLabel]="o.label" />
        </nz-select>
      </se>

      <se col="1" label="作业描述">
        <input nz-input name="remark" formControlName="remark" />
      </se>
    </form>
  </ng-container>
</nz-drawer>

<ng-template #footerTpl>
  <div style="float: left">
    <button nz-button nzType="primary" [disabled]="!pform.valid" (click)="saveJob()">保存</button>
    <button nz-button style="margin-right: 8px" (click)="drawer_close()">取消</button>
  </div>
</ng-template>

<ng-template #addGroupTmpl>
  <label>分组编码</label>
  <input style="width: 100%" nz-input [(ngModel)]="newGroupCode" />
  <label>分组名称</label>
  <input style="width: 100%" nz-input [(ngModel)]="newGroupName" />
</ng-template>

<ng-template #editGroupTmpl>
  <input style="width: 100%" nz-input [(ngModel)]="newGroupName" />
</ng-template>
